<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>ubiquity-slideshow-mint</title>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
	<meta http-equiv="Content-Language" content="en-ca" />
	
	<link href="link/general.css" rel="stylesheet" type="text/css" />
	
	<base target="_blank" />
	
	<script type="text/javascript" src="link/prototype.js"></script>
	<script type="text/javascript" src="link/effects.js"></script>
	<script type="text/javascript" src="link/fastinit.js"></script>
	<script type="text/javascript" src="link/crossfade.js"></script>
	
	<script type="text/javascript" src="directory.js"></script>
	<script src="link/scriptaculous.js" type="text/javascript"></script>
</head>

<body>

<div id="container">
	<div id="slideshow">
		
		<!-- Slides go here. Simply place the following snippet
		in the order you wish it to appear, replacing "MY SLIDE"
		with the filename of your slide.
		<div><a href="MY SLIDE" class="load"></a></div> -->
		<div><a href="welcome.html" class="load"></a></div>
		<!--<div><a href="giants.html" class="load"></a></div>
		<div><a href="desktop-ready.html" class="load"></a></div>
		<div><a href="windows.html" class="load"></a></div>
		<div><a href="safe.html" class="load"></a></div>
		 <div><a href="evolution.html" class="load"></a></div> 
		<div><a href="empathy.html" class="load"></a></div>
		<div><a href="rhythmbox-totem.html" class="load"></a></div>
		<div><a href="installing-software.html" class="load"></a></div> 
		<div><a href="community.html" class="load"></a></div>-->
	</div>
</div>

<script type="text/javascript">
	var options = [], hash;
	var hashes = window.location.hash.slice(window.location.hash.indexOf('?') + 1).split('?');
	
	for(var i = 0; i < hashes.length; i++)
	{
		hash = hashes[i].split('=');
		options.push(hash[0]);
		options[hash[0]] = hash[1];
	}

	function setLocale(locale) {
		var slideanchors = $$("div#slideshow div a");
		
		slideanchors.each(function(anchor) {
			var slide_name = anchor.readAttribute("href");
			var translated_url = "./loc."+locale+"/"+slide_name;
			
			try {
				if ( directory[slide_name][locale] == true )
					anchor.href = translated_url;
			}
			catch(err) {
				/*
				This usually happens if the directory object
				(auto-generated at build time, placed in ./directory.js)
				does not exist. That object is needed to know whether
				a translation exists for the passed locale.
				*/
			}
			
			
			/*
			TODO: Need a list of translated slides by name so we can
			selectively change to translated version only when that
			file exists
			*/
		})
	}
	
	if ( options['locale'] != null )
		setLocale(options['locale']);
	
	if ( options.indexOf('controls') > -1 ) {
		Crossfade.setup({autoLoad:false, random:false, interval:15, duration:0.5, transition:Crossfade.Transition.Cover, autoStart: false });
		document.addEventListener("DOMContentLoaded", function() {
				document.getElementById('debug-controls').style.display = "block";
				document.getElementById("current-slide").value = cf2.filenames[0];
				cf2.stop()
			}, false);
	} else {
		Crossfade.setup({autoLoad:false, random:false, interval:30, duration:0.5, loop:false, transition:Crossfade.Transition.Cover });
	};
	var cf2 = new Crossfade('slideshow');
</script>
<script type="text/javascript"> 
var Reflector = {
  reflect: function(element) {
    element = $(element);
    options = $H({
      amount: 1/3,
      opacity: 1/3,
      fade: 2,
      blur: 0
    }).merge(arguments[1] || {});
 
    var p = element.parentNode, n = element.nextSibling;
    var d = 1.0/(element.height*options.amount);
    var f = document.createDocumentFragment();
 
    (element.height*options.amount).times( function(line) {
      var blurdir = 0;
      var opacitymodifier= 1;
      var heightmodifier= 1;
      if (options.blur==1) { 
        blurdir = (line % 2); 
        opacitymodifier = 2;
        heightmodifier = 3;
      }
      var h = Builder.node('div',{
        style: 'height:'+heightmodifier+'px; width:'+element.width+'px;'
              +'background-image:url('+element.src+');'
              +'background-position:0'+(heightmodifier-2)+'px 0'+(line+1)+'px;'
              +'overflow:hidden;'
              +'margin-top:-'+(heightmodifier-1)+'px;'
      });
      $(h).setOpacity(Math.pow(1-d*line,options.fade)*options.opacity/opacitymodifier); // IE needs the $()
      f.appendChild(h);
    });
 
    // update the view now
    p.insertBefore(f,n);
  }
}
 
Event.observe(window,'load', function(){
  Reflector.reflect('reflection',{ amount:2/3, opacity:1/2, blur:1 });
});
</script>

<div id="debug-controls">
<input type="button" onclick="cf2.previous()" value="&lt;"/>
<input type="text"   id="current-slide" />
<input type="button" onclick="cf2.next()" value="&gt;"/>
</div>

</body>

</html>
